<hr/>
<div class="row-fluid">
    <div class="span12">
        <a class="btn btn-info" id="btn_add" href="${request.contextPath}/member/memberInfo"><i class="icon icon-plus"></i> 添加会员</a>
        <a class="btn btn-info" id="btn_refresh"><i class="icon icon-refresh"></i> 刷新</a>
    </div>
</div>
<div class="row-fluid">
    <div class="span12">
        <div class="widget-box">
            <div class="widget-title">
                <span class="icon"><i class="icon-table"></i></span>
                <h5>会员列表</h5>
            </div>
            <div class="widget-content nopadding">
                <table class="table table-bordered table-striped data-table">
                    <thead>
                        <tr>
                            <th>序号</th>
                            <th>会员编号</th>
                            <th>会员姓名</th>
                            <th>会员等级</th>
                            <th>性别</th>
                            <th>生日</th>
                            <th>电话</th>
                            <th>邮箱</th>
                            <th>QQ</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <#list dataList as member>
                            <tr id="tr_${member.memberId}">
                                <td>${member_index + 1}</td>
                                <td>${member.memberNo}</td>
                                <td>${member.memberName}</td>
                                <td>${member.memberLevel.levelName}</td>
                                <td>${member.gender}</td>
                                <td>${member.birthday}</td>
                                <td>${member.mobile}</td>
                                <td>${member.email}</td>
                                <td>${member.qq}</td>
                                <td>
                                    <a class="btn_edit" href="${request.contextPath}/member/memberInfo?memberId=${member.memberId}"><i class="icon icon-pencil"></i></a>
                                    <a class="btn_delete" href="#" data-key="${member.memberId}"><i class="icon icon-remove"></i></a>
                                </td>
                            </tr>
                        </#list>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<script src="${request.contextPath}/js/jquery-1.12.2.min.js"></script>
<script src="${request.contextPath}/js/jquery.dataTables.min.js"></script>
<script src="${request.contextPath}/js/sweetalert.min.js"></script>
<script type="text/javascript">

    $(function(){

        loadData();

        $("#btn_add").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("td > .btn_edit").click(function(){
            loadPage($(this).attr("href"));
            return false;
        });

        $("td > .btn_delete").click(function(){
            var memberId = $(this).attr("data-key");
            swal({
                title: "信息提示",
                text: "真的要删了它？",
                type: "warning",
                showCancelButton: true,
                confirmButtonText: "是的",
                cancelButtonText: "算了",
                closeOnConfirm: false
            },
            function(isConfirm){
                if(isConfirm){
                    deleteMember(memberId);
                }
            });
            return false;
        });

        $('.data-table').on( 'draw.dt', function () {
            $("td > .btn_edit").unbind("click");
            $("td > .btn_edit").click(function(){
                loadPage($(this).attr("href"));
                return false;
            });

            $("td > .btn_delete").unbind("click");
            $("td > .btn_delete").click(function(){
                var memberId = $(this).attr("data-key");
                swal({
                    title: "信息提示",
                    text: "真的要删了它？",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonText: "是的",
                    cancelButtonText: "算了",
                    closeOnConfirm: false
                },
                function(isConfirm){
                    if(isConfirm){
                        deleteMember(memberId);
                    }
                });
                return false;
            });
        });
    });

    function deleteMember(memberId){
        $.ajax({
            url: "${request.contextPath}/member/deleteMember",
            type: "post",
            data: {
                memberId: memberId
            },
            success: function(result){
                swal({
                    title: "信息提示",
                    text: result.status == "success" ? "恭喜，操作已完成！" : "很遗憾，操作失败了！",
                    type: result.status,
                    animation: "slide-from-top",
                    closeOnConfirm: true
                }, function(){
                    if (result.status == "success"){
                        $("#tr_" + memberId).remove();
                    }
                });
            }
        });
    }

    function loadData(){
        $(".data-table").dataTable({
            "bJQueryUI": true,
            "sPaginationType": "full_numbers",
            "sDom": '<""l>t<"F"fp>'
        });
    }

</script>